<template>
  <div class="sku-box store-content">
    <div class="sort-option">
      <ul class="line clear">
        <li><a href="javascript:;" class="active">综合排序</a></li>
        <li><a href="javascript:;" class>销量排序</a></li>
        <li><a href="javascript:;" class>价格低到高</a></li>
        <li><a href="javascript:;" class>价格高到低</a></li>
      </ul>
    </div>
    <div class="gray-box">
      <div class="item-box">
          <!-- 里面渲染子组件 -->
          <product-list v-for="item in productList" :key="item.spu_id" :item="item"></product-list>
      </div>
    </div>
  </div>
</template>

<script>
import ProductList from '../components/ProductList/ProductList'
export default {
  components:{
    ProductList
  },
  data(){
    return {
      //存放子组件的数据  父组件传给子组件 要在子组件身上自定义属性
      productList:[]
    }
  },
  async created(){
    let res=await fetch('data/goodData.json')
    let data = await res.json();

    console.log(data);
    this.productList=data;
  }
};
</script>

<style>
</style>